<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>注册</title>
    <link rel="stylesheet" type="text/css" th:href="@{/css/common.css}">
    <link rel="stylesheet" th:href="@{/css/register.css}">
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<!-- 头部 end -->
<div class="rg_layout">
    <div class="rg_form clearfix">
        <div class="rg_form_left">
            <p>新用户注册</p>
            <p>USER REGISTER</p>
        </div>
        <div class="rg_form_center pt-lg-5">
            <!--注册表单-->
            <form id="registerForm" name="user" method="post" th:action="@{/user/register.do}">
                <label class="text-danger">[[${result}]]</label>
                <table>
                    <tr>
                        <td class="td_left">
                            <label for="role">账号类型</label>
                        </td>
                        <td class="td_right gender">
                            <label>
                                <input type="radio" name="role" value="顾客" checked>
                                顾客
                            </label>
                            <label>

                                <input type="radio" id="role" name="role" value="厨师">厨师
                            </label>
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                            <label for="username">用户名</label>
                        </td>
                        <td class="td_right">
                            <input type="text" id="username" name="username" placeholder="用户名必须为4-10位数字字母下划线">
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                            <label for="password">密码</label>
                        </td>
                        <td class="td_right">
                            <input type="password" id="password" name="password" placeholder="密码必须为8-20位数字字母下划线" autocomplete>
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                            <label for="confirm_password">确认密码</label>
                        </td>
                        <td class="td_right">
                            <input type="password" id="confirm_password" placeholder="密码必须为8-20位数字字母下划线" autocomplete>
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                            <label for="realname">姓名</label>
                        </td>
                        <td class="td_right">
                            <input type="text" id="realname" name="realname" placeholder="请输入真实姓名">
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                            <label for="phonenumber">手机号</label>
                        </td>
                        <td class="td_right">
                            <input type="text" id="phonenumber" name="phoneNumber" placeholder="请输入手机号">
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                            <label for="email">Email</label>
                        </td>
                        <td class="td_right">
                            <input type="email" id="email" name="email" placeholder="请输入邮箱号">
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                            <label for="emailCheckCode">邮箱验证码</label>
                        </td>
                        <td class="td_right">
                            <button type="button" class="btn btn-success float-right" id="sendEmail">发送</button>
                            <input type="text" id="emailCheckCode" name="emailCheckCode" placeholder="请输入邮箱验证码">
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                            <label for="check">验证码</label>
                        </td>
                        <td class="td_right check">
                            <input type="text" id="check" name="checkCode" class="check" placeholder="输入四位验证码">
                            <img th:src="@{/checkCode.do}" id="checkCode" height="32px" alt="" onclick="getPic()"
                                 title="看不清，点击换一张">
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">
                        </td>
                        <td class="td_right check">
                            <input type="submit" class="submit" value="注册" id="sub">
                            <span id="msg" style="color: red;"></span>
                        </td>
                    </tr>
                </table>
            </form>
        </div>
        <div class="rg_form_right">
            <p>
                已有账号？
                <a th:href="@{/login.html}">立即登录</a>
            </p>
        </div>
    </div>
</div>
<script th:src="@{/js/jquery-3.4.1.js}"></script>
<script th:src="@{/js/register.js}"></script>
</body>
</html>